<template>
  <div v-loading="loading">
    <el-descriptions title="项目信息" label-width="100px" :column="3">
      <el-descriptions-item label="所属项目">{{ detailInfo.projectName }}</el-descriptions-item>
      <el-descriptions-item label="所属项目编号">{{ detailInfo.projectNum }}</el-descriptions-item>
      <el-descriptions-item label="项目地址">{{ detailInfo.fullAddress }}</el-descriptions-item>
      <el-descriptions-item label="建设单位">{{ detailInfo.constructorName }}</el-descriptions-item>
      <el-descriptions-item label="施工总承包">{{ detailInfo.lumpContractorCorpName }}</el-descriptions-item>
    </el-descriptions>
    <el-descriptions  label-width="100px" :column="3" style="margin-top: 15px">
      <template #title>
        账户信息
        <el-tag v-if="detailInfo.accountStatus==2" class="m-l" type="warning" >进账: ￥{{ detailInfo.incomeAmount }}</el-tag>
        <el-tag v-if="detailInfo.accountStatus==2" class="m-l" type="warning">线上代发: ￥{{ detailInfo.onlinePaymentAmount }}</el-tag>
        <el-tag v-if="detailInfo.accountStatus==2" class="m-l" type="warning">线下代发: ￥{{ detailInfo.offlinePaymentAmount }}</el-tag>
        <el-tag v-if="detailInfo.accountStatus==2" class="m-l">余额: ￥{{ detailInfo.balance }}</el-tag>
      </template>
      <el-descriptions-item label="账户名称">{{ detailInfo.username }}</el-descriptions-item>
      <el-descriptions-item label="银行账号">{{ detailInfo.bankNo }}</el-descriptions-item>
      <el-descriptions-item label="开户银行">{{ detailInfo.bankName }}</el-descriptions-item>
      <el-descriptions-item label="开户支行">{{ detailInfo.bankSubbranch }}</el-descriptions-item>
      <el-descriptions-item label="账户状态">
        <el-tag v-if="detailInfo.accountStatus == 1" type="info"> {{ detailInfo.accountStatusName }}</el-tag>
        <el-tag v-if="detailInfo.accountStatus == 2"> {{ detailInfo.accountStatusName }}</el-tag>
        <el-tag v-if="detailInfo.accountStatus == 3" type="warning"> {{ detailInfo.accountStatusName }}</el-tag>
        <el-tag v-if="detailInfo.accountStatus == 4" type="warning"> {{ detailInfo.accountStatusName }}</el-tag>
        <el-tag v-if="detailInfo.accountStatus == 5" type="danger"> {{ detailInfo.accountStatusName }}</el-tag>
      </el-descriptions-item>
      <el-descriptions-item label="银行是否对账户设置特殊标识" span="2">
        <el-tag> {{ detailInfo.bankMark ? "是" : "否" }}</el-tag>
      </el-descriptions-item>

      <el-descriptions-item label="开户申请人">{{ detailInfo.creator }} </el-descriptions-item>
      <el-descriptions-item label="开户申请日期" span="2"
        >{{ moment(detailInfo.createTime).format("YYYY-MM-DD") }}
      </el-descriptions-item>
      <el-descriptions-item label="开户人">{{ detailInfo.optUserName }} </el-descriptions-item>
      <el-descriptions-item label="开户工号">{{ detailInfo.optUserCode }} </el-descriptions-item>

      <el-descriptions-item label="开户日期">{{
        moment(detailInfo.openDate).format("YYYY-MM-DD")
      }}</el-descriptions-item>

      <el-descriptions-item label="建设单位审核人">{{ detailInfo.constructorChecker }} </el-descriptions-item>
      <el-descriptions-item label="证件号码"
        >{{ detailInfo.constructorCardNo }}
        <el-tag style="margin-left: 5px">{{ detailInfo.lumpContractorCorpType }} </el-tag></el-descriptions-item
      >
      <el-descriptions-item label="联系电话">{{ detailInfo.constructorMobile }} </el-descriptions-item>

      <el-descriptions-item label="总承包审核人">{{ detailInfo.lumpContractorCorpChecker }} </el-descriptions-item>
      <el-descriptions-item label="证件号码"
        >{{ detailInfo.lumpContractorCorpCardNo
        }}<el-tag style="margin-left: 5px"> {{ detailInfo.lumpContractorCorpType }} </el-tag>
      </el-descriptions-item>
      <el-descriptions-item label="联系电话">{{ detailInfo.lumpContractorCorpMobile }} </el-descriptions-item>

      <el-descriptions-item v-if="detailInfo.accountStatus == 5" label="销户操作人"
        >{{ detailInfo.canceller }}
      </el-descriptions-item>
      <el-descriptions-item v-if="detailInfo.accountStatus == 5" label="销户日期"
        >{{ moment(detailInfo.cancelTime).format("YYYY-MM-DD") }}
      </el-descriptions-item>
      <el-descriptions-item v-if="detailInfo.accountStatus == 5" :span="3" label="销户原因说明"
        >{{ detailInfo.cancelReason }}
      </el-descriptions-item>
    </el-descriptions>
  </div>
</template>
<script setup lang="ts">
import { GetProjectSpecialAccount } from "@/api/specialaccount/index";
import moment from "moment";
const props = defineProps({
  id: {
    type: Number,
    default: 0,
  },
});
const { id } = toRefs(props);
const detailInfo = ref<any>({});
const loading = ref<boolean>(false);

//初始化
const initForm = () => {
  loading.value = true;
  GetProjectSpecialAccount(id.value)
    .then((res) => {
      if (res.success) {
        detailInfo.value = res.data;
      }
    })
    .finally(() => {
      loading.value = false;
    });
};

onMounted(() => {
  initForm();
});
</script>

<style scoped>
.m-l{
  margin-left: 10px;
}
</style>
